<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
            let str = `<div>{{name}}</div>
            <div>{{age}}</div>`;
            let data = {
                 name:'汤姆',
                 age:'12'
            }
            let rep = /\{\{(\w+)\}\}/;
            // 模板渲染
            function render(template,data){
                   if(rep.test(template)){
                    //    replace 不会改变原来的地址
                       template = template.replace(rep.exec(template)[0],data[rep.exec(template)[1]]);
                       return render(template,data); //递归查找
                   }
                    //   console.log(template)
            }
            render(str,data);



            var arr = [
                  
            ];
             // 只需要 填入 跟字段 和 需要处理的数组即可   
             // 封装
            // function filterdata(name,arr){
            //     let newobj = [];
            //         newobj.push({
            //             name:name,
            //             children:filterdata1(name,arr)
            //         })
            //       return newobj;
            // }
            // // 二级 分类
            // function filterdata1(names,arr){
            //          let newobj = [];
            //          let setobj = {};
            //          for(let n = 0;n<arr.length;n++){
            //              if(arr[n].name1==names){
            //                  if(!setobj[arr[n].name2]){
            //                      setobj[arr[n].name2] = 1;
            //                      newobj.push({
            //                         name:arr[n].name2,
            //                         children:filterdata2(arr[n].name2,arr)
            //                     })
            //                  } 
            //              }   
            //         }
            //         return newobj;
            // }
            // // 三级分类
            // function filterdata2(names,arr){
            //          let newobj = [];
            //          for(let n = 0;n<arr.length;n++){
            //              if(arr[n].name2==names){
            //                  newobj.push({
            //                     name:arr[n].name3,
            //                     children:[]
            //                  })
            //              }  
            //         }
            //         return newobj;
            // }    
            // console.log(filterdata('asd2',arr));



            function filterdata(name1,name2,arr){
               
                // 多维化链式数据、单维化链式数据
                let newobj = [];
                
                    newobj.push({
                        name:name1,
                        children:filterdata1(name1,name2,arr)
                    })
                 
                return newobj;
            }
            // 二级 分类
            var filterdata1 = (name1,name2,arr)=>{
                    let newobj = [];
                    let setobj = {};
                    
                    newobj.push({
                                name:name2,
                                children:filterdata2(name1,name2,arr)
                                })
                   
                    return newobj;
            }
            // 三级分类
            var filterdata2 = (name1,name2,arr)=>{
                    let newobj = [];

                    for(let n = 0;n<arr.length;n++){
                        if(arr[n].name1==name1&&arr[n].name2==name2){
                            newobj.push({
                                name:arr[n].name3,
                                children:[]
                            })
                        }  
                    }
                    return newobj;
            } 

            let arrs = [
                 {
                    name1:'测试1',
                    name2:'测试1-1',
                    name3:'测试1-1-1',
                    name4:'测试1-1-1-1'  
                 },
                 {
                    name1:'测试1',
                    name2:'测试1-1',
                    name3:'测试1-1-2',
                    name3:'测试1-1-2-1'  
                 },
                 {
                    name1:'测试1',
                    name2:'测试1-1',
                    name3:'测试1-1-2',
                    name3:'测试1-1-2-2'  
                 }
            ]   
            let obj = {
                   name:'测试1',
                   children:[
                        {
                           name:'测试1-1',
                           children:[
                                    {
                                    name:'测试1-1-1' 
                                    },
                                    {
                                    name:'测试1-1-2',
                                    children:[
                                            {
                                            name:'测试1-1-2-2' 
                                            },
                                            {
                                            name:'测试1-1-2-2' 
                                            },
                                        ]  
                                    },
                            ] 
                        }
                   ]
            }
        //    console.log(filterdata('asd1','asd1-1',arrs))
        // 使用 类的封装   // 多维化链式数据、单维化链式数据
            class fIlterDatas{
                 #name1;
                 #name2;
                 #arr;
                 constructor(name1,name2,arr){
                    this.#name1 = name1;
                    this.#name2 = name2;
                    this.#arr = arr;
                    this.len = arr.length;
                
                 }
                 set len(e){
                       if(e<1){
                            throw new Error('len cannot be empty or empty less than 1');
                       }
                 }
                 initdata(){
                    return this.filterdata();
                 }
                 filterdata(){
                        
                     
                         let newobj = [];
                        
                            newobj.push({
                                name:this.#name1,
                                children:this.filterdata1()
                            })
                            
                        return newobj;
                  }
                  filterdata1(){
                    let newobj = [];
                    let setobj = {};
                    
                    newobj.push({
                                name:this.#name2,
                                children:this.filterdata2()
                                })
                   
                    return newobj;
              }
              filterdata2(){
                    let newobj = [];
                    for(let n = 0;n<this.len;n++){
                        if(this.#arr[n].name1==this.#name1&&this.#arr[n].name2==this.#name2){
                            newobj.push({
                                name:this.#arr[n].name3,
                                children:[]
                            })
                        }  
                    }
                    return newobj;
             } 

            }        
      let filter = new fIlterDatas('asd1','asd1-1',arrs);
      console.log(filter.initdata());
    


    </script>
</body>
</html>